import 'package:flutter/material.dart';
import 'package:flutter_douban/config/app_colors.dart';

class NavHomePage extends StatefulWidget {
  const NavHomePage({Key? key}) : super(key: key);

  @override
  _NavHomePageState createState() => _NavHomePageState();
}

class _NavHomePageState extends State<NavHomePage> {
  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        Container(
          height: 45,
          color: Colors.white,
          margin: EdgeInsets.only(left: 0, right: 0),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              _leftView(),
              _messageView(),
            ],
          ),
        ),
        Positioned(
          top: 5,
          right: 0,
          child: Container(
            width: 14,
            height: 14,
            decoration: BoxDecoration(
              color: Colors.red,
              borderRadius: BorderRadius.circular(7),
            ),
            child: Text(
              '2',
              textAlign: TextAlign.center,
              style: TextStyle(
                fontSize: 9,
                color: Colors.white,
              ),
            ),
          ),
        )
      ],
    );
  }

  Widget _leftView() {
    return Row(
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        Container(
            width: 30,
            height: 30,
            child: InkWell(
                onTap: () {},
                child: Image(
                    image: AssetImage("assets/images/common/group_add.png"),
                    fit: BoxFit.cover))),
        SizedBox(
          width: 12,
        ),
        SizedBox(
          width: MediaQuery.of(context).size.width - 140,
          height: 35,
          child: FlatButton(
            onPressed: () => print(''),
            child: Row(
              children: [
                Image(
                  image:
                      AssetImage("assets/images/common/button_search_gray.png"),
                  fit: BoxFit.cover,
                  width: 18,
                  height: 18,
                ),
                SizedBox(
                  width: 5,
                ),
                Text(
                  '懒人食谱',
                  style: TextStyle(
                    color: Colors.black26,
                    fontSize: 14,
                  ),
                )
              ],
            ),
            color: AppColors.page,
            shape: RoundedRectangleBorder(
                side: BorderSide(
                  color: AppColors.page,
                  width: 0.5,
                ),
                borderRadius: BorderRadius.circular(1)),
          ),
        ),
        SizedBox(
          width: 12,
        ),
        Container(
            width: 22,
            height: 22,
            child: InkWell(
                onTap: () {},
                child: Image(
                    image: AssetImage(
                        "assets/images/common/icon_home_category.png"),
                    fit: BoxFit.cover))),
      ],
    );
  }

  /// 消息
  Widget _messageView() {
    return Container(
        width: 25,
        height: 25,
        child: InkWell(
            onTap: () {},
            child: Image(
                image:
                    AssetImage("assets/images/common/navi_item_messages.png"),
                fit: BoxFit.cover)));
  }
}
